import React, { Component } from 'react';
import { Text, Image, View, TouchableOpacity, ScrollView } from 'react-native';
import { unitWidth, width } from '../constants/AdapterUtil';
import { MyHeader } from '../components/MyHeader';
import Colors from '../constants/Colors';
import { postFetch } from '../constants/HttpExtension';
import { show } from '../constants/Toast';
import { SubmitButton1, SubmitButton4 } from '../components/Button';
import { WebView } from 'react-native-webview';
import { CommonModal, CommonModal2, BottomPayModal, BottomPayModeModal, CommonModal3 } from '../components/Modal';
import { api_order_workorder_prepayment, api_order_workorder_orderpay } from '../constants/HttpServices';
import { zfbPay, wxPay } from '../constants/Pay';
import { contactBrowser } from '../constants/Gobrowser';
import CommonUtil from '../constants/CommonUtil';

export default class SigningContractScreen extends Component {

    constructor(props) {
        super(props)

        const { navigation } = this.props;
        this.no = this.props.navigation.getParam('no', '0')
        this.state = {
            pay_type: 0,//支付的模式预支付方式 1 =全款 ，2= 5-5
        }
    }

    componentDidMount() {
        this.props.navigation.addListener('didFocus', payload => {
            this.getData();
        })
    }

    componentWillUnmount() {

    };

    render() {

        return (
            <View style={{ flex: 1, backgroundColor: Colors.colorEF }}>
                <MyHeader title='签署电子合同' leftImg={require('../res/ic_arrow_left.png')} leftClick={() => { this.props.navigation.pop() }} />
                <WebView
                    style={{}}
                    textZoom={100}
                    javaScriptEnabled // 仅限Android平台。iOS平台JavaScript是默认开启的。
                    domStorageEnabled // 适用于安卓
                    scrollEnabled={false}
                    source={{ html: CommonUtil.getHtml(global.setting.compact) }}
                />
                <View style={{ position: 'absolute', bottom: 0, height: 50 * unitWidth, backgroundColor: Colors.white, width: width, justifyContent: 'center' }}>
                    <SubmitButton4 style={{ alignSelf: 'center' }} text='立即签署' onPress={() => {
                        this.refs.BottomPayModeModal.showModal();
                    }} />
                </View>
                <BottomPayModeModal ref='BottomPayModeModal' onClick={(index) => {
                    this.setState({
                        pay_type: index
                    }, () => {
                        this.sign();
                        // this.refs.BottomPayModal.showModal();
                    })
                }} />
                <BottomPayModal ref='BottomPayModal' onClick={(index) => {
                    this.pay(index);
                }} />
                <CommonModal3 ref='CommonModal3' title={'恭喜你签订成功\n请耐心等待服务商确认哦'} btnText='确定'
                    onPress={() => {
                        this.refs.CommonModal3.hideModal();
                    }} />
            </View>
        );
    }

    sign() {
        let params = {
            'out_trade_no': this.no,
            'type': this.state.pay_type,
        }
        postFetch(api_order_workorder_prepayment, params, {
            success: (response) => {
                if (response.result.status == '1') {
                    this.refs.BottomPayModal.showModal();
                }
            },
            fail: (response) => {
                show(response.result.message);
            }
        })
    }

    pay(type) {
        let params = {
            'out_trade_no': this.no,
            'payment_type': type,
        }
        postFetch(api_order_workorder_orderpay, params, {
            success: (response) => {
                if (type == 1) {
                    wxPay(response.result, {
                        success: () => {
                            show('支付成功');
                            this.props.navigation.pop();
                        },
                        fail: () => {

                        }
                    })
                } else if (type == 2) {
                    contactBrowser(response.result.url)
                } else if (type == 3) {
                    show('支付成功');
                    this.props.navigation.pop()
                }
            },
            fail: (response) => {
                show(response.result.message);
            }
        })
    }
}